<template>
  <div class="main">
    <el-row>
      <el-col :span="12">
        <div class="first">
          <!-- <div><img src="" alt=""></div> -->
          <slot name="left" />
        </div>
      </el-col>
      <el-col :span="12">
        <div class="second"><slot name="right" /></div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {}
</script>

<style lang="scss">

.main {
  margin: 20px;
}
.first {
  padding: 20px;
  margin: 0 10px;
  height: 166px;
  border-radius: 15px;
  background-color: #e9f3ff;
  background-image: url(),
    url(http://likede2-admin.itheima.net/img/day.4272ef60.png);
  background-repeat: no-repeat, no-repeat;
  background-position: 0 0, calc(100% - 12px) 100%;
}
.second {
  text-shadow: 2px 4px 7px rgb(255 99 85 / 50%);
  padding: 20px;
  margin: 0 10px;
  height: 166px;
  border-radius: 15px;
  background-color: #fbefe8;
  background: #fbefe8
    url(http://likede2-admin.itheima.net/img/operation.4120cc58.png) no-repeat
    calc(100% - 12px) 100%;
}
</style>
